﻿@page
@model Web.Pages.Product.IndexModel
@{

}

<table id="magtable" lay-filter="magevent"></table>

@section Scripts{
    <script>
        layui.use(['form', 'table', 'upload'], function () {
            var $ = layui.jquery
                , form = layui.form
                , table = layui.table
                , upload = layui.upload;

            table.render({
                id: "listReload"
                , skin: 'line '
                , elem: '#magtable'
                , url: '/Api/Magic/FindList'
                , method: "POST"
                , contentType: 'application/json'
                , toolbar: '#toolbar'
                , loading: true
                , defaultToolbar: ['filter']
                , cols: [[
                    { field: 'id', title: 'AppId', align: 'center' }
                    , { field: 'name', title: '项目名称', sort: true, align: 'center' }
                    , { field: 'remarks', title: '简介', sort: true, align: 'center' }
                    , { field: 'upExplain', title: '升级说明', sort: true, align: 'center' }
                    , { title: '操作', toolbar: '#bar', align: 'center' }
                ]]
                , page: true
            });

            table.on("toolbar(magevent)", function (obj) {
                var checkStatus = table.checkStatus(obj.config.id);
                switch (obj.event) {
                    case 'addmag':
                        layer.open({
                            title: '添加项目',
                            type: 1,
                            content: $("#diag_add").html(),

                        })
                        break;
                };
            });
            table.on("tool(magevent)", function (obj) {
                var data = obj.data;
                switch (obj.event) {
                    case 'up':
                        layer.open({
                            title: '上传文件',
                            type: 1,
                            content: $("#diag_up").html(),
                            success: function (layero, index) {
                                upFile.url = "/Api/File?AppId=" + data.Id
                            }
                        })
                        break;
                }
            });

            form.on("submit(add_btn)", function (obj) {
                $.ajax({
                    url: '/Api/Magic'
                    , contentType: 'application/json'
                    , type: 'POST'
                    , data: JSON.stringify(obj.field)
                    , success: function (res) {

                    }
                });
                return false;
            });
            form.on("submit(modify_btn)", function (obj) {
                $.ajax({
                    url: '/Api/Magic'
                    , contentType: 'application/json'
                    , type: 'Patch'
                    , data: JSON.stringify(obj.field)
                    , success: function (res) {

                    }
                });
                return false;
            });

            var upFileOptions = {
                elem: '#test3'
                , acceptMime: '压缩文件/zip'
                , exts:'zip'
                , accept: 'zip' //普通文件
                , done: function (res) {
                    console.log(res)
                }
            }

            var upFileCreate = function () {

            };
           
            
        });
    </script>
    <script type="text/html" id="toolbar">
        <div class="layui-btn-container">
            <button class="layui-btn layui-btn-normal" lay-event="addmag">添加项目</button>
        </div>
    </script>
    <script type="text/html" id="bar">
        <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="up">上传文件</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    </script>
    <script type="text/html" id="diag_add">
        <form class="layui-form" style="padding:10px 20px;">
            <div class="layui-form-item">
                <label class="layui-form-label">项目名称</label>
                <div class="layui-input-inline">
                    <input name="Name" class="layui-input" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">简介</label>
                <div class="layui-input-inline">
                    <textarea name="Remarks" class="layui-textarea" />
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn layui-btn-normal" lay-submit lay-filter="add_btn">确认</button>
                </div>
            </div>
        </form>
    </script>
    <script type="text/html" id="diag_up">
        <form class="layui-form" style="padding:10px 20px;">
            <div class="layui-form-item">
                <label class="layui-form-label">更新说明</label>
                <div class="layui-input-inline">
                    <textarea class="layui-textarea" />
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" id="file_holder"><i class="layui-icon layui-icon-upload"></i>选择文件</button>
                    <button type="button" class="layui-btn" id="file_up">开始上传</button>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn layui-btn-normal" lay-submit lay-filter="modify_btn">确认</button>
                </div>
            </div>
        </form>
    </script>
}